 <!DOCTYPE html>
<html>
<head>
	<title>{% block title %}Blonde With White Butt{% endblock %}</title>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
var markersArray = [];
var map;
var geocoder = null;
jQuery(window).load(function() {
    initialize();
});
function initialize() {
  if(jQuery('#id_point_latitude').val() && jQuery('#id_point_longitude').val())
  {
    var latlng = new google.maps.LatLng(jQuery('#id_point_latitude').val(), jQuery('#id_point_longitude').val());
  }else{
     var latlng = new google.maps.LatLng(54.6680700400592, 25.257037109375005);
  }
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);
    if(jQuery('#id_point_latitude').val() && jQuery('#id_point_longitude').val())
    {
        marker = new google.maps.Marker({
          position: latlng,
          map: map
        });
        markersArray.push(marker);
    }
    google.maps.event.addListener(map, 'click', function(event) {
        OnGoogleClicked(event.latLng);
    });


}
jQuery(window).unload(function() {
    GUnload();
});

function OnGoogleClicked(point)
{
    jQuery('#id_point_latitude').val(point.lat());
    jQuery('#id_point_longitude').val(point.lng());
    if (markersArray) {
        for (i in markersArray) {
            markersArray[i].setMap(null);
    }
    markersArray.length = 0;
  }
    marker = new google.maps.Marker({
        position: point,
        map: map
    });
    markersArray.push(marker);
}

</script>
<body onload="initialize()">
<div id="map_canvas" style="width:500px; height:200px"></div>
{% block mainheading %}Positions - create new{% endblock %}

{% block mainmenu %}
	<li><a href="/position/">All Positions</a></li>
{% endblock %}



{% block content %}

	<form action="." method="post">
	{% csrf_token %}
	<table>
		{{ form.as_table }}
	<table>
	<input type="submit" class="default" value="Save" />
	<input type="button" value="List o Poiitons" onclick="document.location.href='/position/'; return false;" />
	</form>

{% endblock %}
</body>
